import React, { useRef } from "react";
import { Button } from "antd";
export default function Tsetref() {
  const refInput = useRef(null)
  // 修改/获取DOM元素
  const getRef = () => {
    // refInput.current.width = 30+'px'
    // 通过ref修改元素的属性
    refInput.current.style.height = 100 + 'px'
    refInput.current.style.width = '500px'
    // 获取input框的内容
    console.log(refInput.current.value)
  }
  return (
    <div>
      <h2>useRef</h2>
      <input type="text" ref={refInput} style={{ width: '100px', height: '50px' }} />
      <Button onClick={getRef}>getRef</Button>
    </div>
  )
}



